import { fileURLToPath, URL } from 'node:url'
import { createHtmlPlugin } from 'vite-plugin-html';
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import cesium from 'vite-plugin-cesium';
import postCssPxToRem from 'postcss-pxtorem';

export default defineConfig({
  base: './',
  server: {
    host: '0.0.0.0',
    port: 9527,      // 你可以指定一个端口，例如3000
    // 启用HTTPS协议
    // https: {
    //   pfx: './public/mykeystore.p12', // 证书路径 
    //   passphrase: 'lhd123' // 证书密码 
    // },
    // 自定义端口
    // port: 3000,
    // 如果是开发环境，配置代理，避免跨域问题
    proxy: {
      '/api': {
        target: 'http://192.168.0.156:10240',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ''),
      },
    },
  },
  plugins: [
    vue(),
    vueJsx(),
    cesium(),
    createHtmlPlugin({
      minify: true,
      inject: {
        injectHead: [
          `<style>
            html { font-size: 16px; }
          </style>`
        ]
      }
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
  },
  assetsInclude: ['**/*.glb', '**/*.png', '**/*.jpg', '**/*.jpeg', '**/*.svg', '**/*.gif'],
  css: {
    postcss: {
      plugins: [
        postCssPxToRem({
          rootValue: 16, // 1rem等于多少px
          propList: ['*'],
          // exclude: /node_modules/i,
          // 排除该class
          // selectorBlackList: '',
        }),
      ],
    },
    preprocessorOptions: {
      less: {}
    }
  },
  build: {
    // 设置最终构建的浏览器兼容目标
    target: 'es2015',
    // 构建后是否生成 source map 文件
    sourcemap: false,
    //  chunk 大小警告的限制（以 kbs 为单位）
    chunkSizeWarningLimit: 2000,
    // 启用/禁用 gzip 压缩大小报告
    reportCompressedSize: false,
    // rollupOptions: {
    //   input: {
    //     main: 'index.html',
    //     welcome: 'welcome.html'
    //   }
    // }
    assetsDir: 'assets', // 添加这行
    assetsInlineLimit: 0, // 添加这行
    assetsInclude: ['**/*.glb', '**/*.png', '**/*.jpg', '**/*.jpeg', '**/*.svg', '**/*.gif'],
    rollupOptions: {
      output: {
        // 静态资源路径配置
        assetFileNames: (chunkInfo) => {
          // 区分不同类型的资源
          if (chunkInfo.name?.endsWith('.css')) {
            return 'assets/css/[name].[hash][extname]';
          }
          return 'assets/img/[name].[hash][extname]';
        },
        // JS 文件路径
        chunkFileNames: 'assets/js/[name].[hash].js',
        entryFileNames: 'assets/js/[name].[hash].js',
        // 确保 CSS 代码分割
        cssCodeSplit: true,
        // 显式禁用 CSS 内联
        inlineDynamicImports: false
      }
    }
  },
})
